<!DOCTYPE html>
<html lang="zh">

	<head>
		<meta charset="UTF-8">
		<meta name=”renderer” content=”webkit”>
		<meta http-equiv=”X-UA-Compatible” content=”IE=Edge,chrome=1″ >
		<title>后台</title>
			<meta name="keywords" content="幼儿，亲子游，教育，游泳馆 " />

		<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
		<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

		<!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
		<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
		<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
		<link rel="stylesheet" href="css/samples-styles.css">
		<style type="text/css">
			td.alt {
				. background-color: #ffc;
				background-color: rgba(230, 127, 34, 0.2);
			}
		</style>
	</head>

	<body>

		<div class="manage container" style="    border: solid 1px brown;border-radius: 5px;">
			<nav class="navbar navbar-default">
				<div class="container-fluid" style="background-color: brown;">
					<div class="navbar-header">
						<a class="navbar-brand" href="#" style="color: white;">
							哈珀后台管理系统
						</a>
						<button id="btn" style="margin-top: 8px" class="btn btn-primary">点击这里将表格内容导出到excel中</button>
					</div>
				</div>
			</nav>
			<div class="htmleaf-content">
				<div class="input-group">
					<div class="input-group-addon" style="background-color: brown;color: white;">搜索</div>
					<input class="form-control" type="search" id="input-filter" size="15" placeholder="输入条件"></input>
				</div>
				<br>
				<table class="table2excel" id="table2excel">
					<thead>
						<tr>
							<th scope="col" title="President Number" width="5%">序号</th>
							<th scope="col">时间</th>
							<th scope="col" width="20%">姓名</th>
							<th scope="col" width="5%">年龄</th>
							<th scope="col" width="10%">联系方式</th>
							<th scope="col" width="10%">预约门店</th>
							<th scope="col" width="30%">反馈建议</th>
							<th scope="" width="5%">操作</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>1</td>
							<td>2017年3月18日</td>
							<td>赵小明</td>
							<td>5</td>
							<td>1854512748</td>
							<td>乐享城店</td>
							<td>哦屁哦IP屁哦屁哦皮欧派</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年3月18日</td>
							<td>赵小明</td>
							<td>5</td>
							<td>1854512748</td>
							<td>乐享城店</td>
							<td>哦屁哦IP屁哦屁哦皮欧派</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年3月18日</td>
							<td>赵小明</td>
							<td>5</td>
							<td>1854512748</td>
							<td>乐享城店</td>
							<td>哦屁哦IP屁哦屁哦皮欧派</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年4月18日</td>
							<td>康小哈</td>
							<td>10</td>
							<td>1854512748</td>
							<td>应急店</td>
							<td>阿萨实打实大</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年3月18日</td>
							<td>赵小明</td>
							<td>5</td>
							<td>1854512748</td>
							<td>乐享城店</td>
							<td>哦屁哦IP屁哦屁哦皮欧派</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>
						<tr>
							<td>1</td>
							<td>2017年3月18日</td>
							<td>赵小明</td>
							<td>5</td>
							<td>1854512748</td>
							<td>乐享城店</td>
							<td>哦屁哦IP屁哦屁哦皮欧派</td>
							<td class="delete"><a href="#">删除</a></td>
						</tr>

					</tbody>
				</table>

			</div>
		</div>
			<script src="http://cdn.bootcss.com/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>

			<script src="js/jquery.filtertable.min.js"></script>
			<script src="js/jquery.table2excel.min.js"></script>

			<script>
				$(document).ready(function() {
					$('table').filterTable({ // apply filterTable to all tables on this page
						inputSelector: '#input-filter' // use the existing input instead of creating a new one
					});
				});
			</script>
			<script>
				$(function() {
					$('.delete').click(function() {
						$(this).parent().remove()
					})
				})
			</script>
			<script>
				$(function() {
					$("#btn").click(function() {
						$(".table2excel").table2excel({
							exclude: ".noExl",
							name: "Excel Document Name",
							filename: "namelist",
							exclude_img: true,
							exclude_links: true,
							exclude_inputs: true
						});
					});

				});
			</script>
	</body>

</html>